<template>
  <div>
    <div class="margin-container-list">
      <div class="pad-b-20 pad-t-20">
        <el-button @click="codeVisible = true" class="open-btn" type="primary">新建</el-button>
      </div>
      <div class="top-operate-default">
        <div class="search-item">
          <label>搜索门店：</label>
          <el-select v-model="entity.keywordType" placeholder="请选择" class="takeSelect">
            <el-option v-for="item in storeOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-input v-model="entity.keyword" @keyup.enter.native="handleSearch" placeholder="请输入搜索内容"
            style="width: 300px"></el-input>

          <el-button-group class="mar-l-20">
            <el-button type="primary" @click="handleSearch" style="margin-left: 10px">查询</el-button>
            <el-button @click="handleReset">重置</el-button>
          </el-button-group>
        </div>
      </div>
      <!-- 内容列表 -->
      <div class="table-container mar-t-20">
        <el-table :data="entityList" v-loading="listLoading" element-loading-text="加载中" style="width: 100%">
          <el-table-column label="门店名称" prop="storeName"></el-table-column>
          <el-table-column label="门店业务" prop="storeId" :formatter="showStoreBusinessFormat">
          </el-table-column>
          <el-table-column label="门店电话" prop="storePhone"></el-table-column>
          <el-table-column label="门店地址" prop="storeAddress" :formatter="storeAddressFormat"></el-table-column>
<!--          <el-table-column width="120px" label="门店二维码" prop="storeWxCode">
            <template slot-scope="scope">
              <div v-if="scope.row.storeWxCode">
                <el-image style="width: 50px; height: 50px" :src="scope.row.storeWxCode"
                  :preview-src-list="[scope.row.storeWxCode]"></el-image>
              </div>
              <div v-else><span>--</span>
              </div>
            </template>
          </el-table-column> -->
          <el-table-column label="绑定仓库" prop="warehouseName"></el-table-column>
          <!-- <el-table-column label="主管理员" prop="administratorsName"></el-table-column> -->
          <el-table-column width="260px" label="主管理员">
            <template slot-scope="scope">
              <div @click="handleUpdate(scope.row)" class="flex v-align-c cursor-p">
                <div class="font-14 pad-l-10">
                  <div><span class="font-color-9">姓名：</span>{{scope.row.administratorsName}}</div>
                  <div><span class="font-color-9">账号：</span>{{scope.row.administratorsPhone}}</div>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="状态" prop="storeState">
            <template slot-scope="scope">
              <el-switch v-model="scope.row.storeState" @change="switchChange(scope.row)" active-color="#13ce66"
                inactive-color="#ff4949" :active-value="1" :inactive-value="0"></el-switch>
              {{ scope.row.storeState == 1 ? '启用' : '禁用' }}
            </template>
          </el-table-column>

          <el-table-column width="160px" label="操作" align="right" fixed="right">
            <template slot-scope="scope">
              <el-button type="text" @click="editStoreInfo(scope.row)">编辑</el-button>
              <el-button type="text" @click="editMemberInfo(scope.row)">账户</el-button>
              <el-button type="text" @click="linkStoreGoodsPage(scope.row)">门店商品</el-button>
              <el-popconfirm @onConfirm="delBrand(scope.row)" title="门店删除后无法恢复,确定要删除？">
                <el-button slot="reference" type="text">删除</el-button>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <!-- 列表分页 -->
      <pagination v-show="total>0" :total="total" :page.sync="entity.currentPage" :limit.sync="entity.size"
        @pagination="getList" />
    </div>
    <!-- 新建门店弹窗 -->
    <el-dialog title="总部直营门店申请码" class="code-area-box" :visible.sync="codeVisible" width="340px" :show-close="false"
      :close-on-click-modal="true">
      <div class="code-box">
        <img :src="commanderWxaCode" v-if="commanderWxaCode" />
      </div>
      <div slot="footer" class="dialog-footer">
        <p>用微信"扫一扫" 扫描上方二维码</p>
        <p>开通门店权限</p>
      </div>
    </el-dialog>

    <!-- 门店信息弹窗 -->
    <el-dialog class="new-store-dialog" title="编辑门店" :visible.sync="newStoreDialog" v-if="newStoreDialog" width="50%">
      <el-form :model="entity" :rules="rules" ref="entity" label-width="140px">
        <el-form-item label="绑定微客:">
          <div class="flex v-align-c cursor-p">
            <div class="block">
              <el-avatar :size="50" :src="entity.memberAvatar"></el-avatar>
            </div>
            <div class="font-14 pad-l-10">
              <div>昵称：{{ entity.memberNickName}}</div>
              <div>手机：{{ entity.memberPhone}}</div>
            </div>
          </div>
        </el-form-item>
        <el-form-item label="门店名称：" prop="storeName">
          <el-input v-model="entity.storeName" placeholder="请输入门店名称" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="门店电话：" prop="storePhone">
          <!-- <el-input v-model="entity.storePhone" type="tel" placeholder="请输入门店电话" maxlength="11"
            oninput="this.value=this.value.replace(/^[0,2,3,4,5,6,7,8,9]*$/gi,'')"
            onkeyup="this.value=this.value.replace(/\D/g,'')"></el-input> -->
          <el-input v-model="entity.storePhone" type="tel" placeholder="请输入门店电话" maxlength="13"></el-input>
          <span>PS：区号或400开头的必须带有：<span style="color:red;">-</span></span>
        </el-form-item>
        <el-form-item label="门店照片">
          <div class="flex height-148 upload-remove-bar">
            <el-upload list-type="picture-card" action="/api/common/uploadFiles"
              accept="image/jpeg,image/gif,image/png,image/bmp" name="files" multiple :data="token"
              :show-file-list="false" v-loading="shareFileLoading" :on-success="handleUploadShareImageUrlSuccess"
              :before-upload="beforeShareImageUrlUpload">
              <img v-if="entity.storeImage" :src="entity.storeImage" style="width: 150px;height: 150px">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
            <div class="close-icon width-36 height-36 flex flex-center cursor-p" @click="closeEls()">
              <svg-icon v-if="entity.storeImage" icon-class="close" class="icon font-16 noraml-hide active" />
            </div>
          </div>
          <div class="tips mar-t-3">最多上传1张，建议尺寸420*420像素，小于3M，支持jpg、png、jpeg格式</div>
        </el-form-item>
        <el-form-item label="门店地址：" prop="selectPCDValue">
          <AddressSelect ref="addressSelectRef" :onChangeAddressCode="onChangeAddressCode">
          </AddressSelect>
        </el-form-item>
        <el-form-item prop="storeAddress">
          <el-input v-model="entity.storeAddress" placeholder="详细地址(请勿重复填写省市区)"></el-input>
        </el-form-item>
        <el-form-item label="自定义范围:" prop="isCustomAddress">
          <MapDeliveryRange ref="deliveryRangeRef" :onConfirm="handleConfirm"
            :onCustomDeliveryRange="handleCustomDeliveryRange"
            :onHandleIsCustomDeliveryRange="onHandleIsCustomDeliveryRange"
            :onHandleSetCustomDeliveryRange="onHandleSetCustomDeliveryRange"></MapDeliveryRange>
        </el-form-item>
        <el-form-item label="门店业务：" required>
          <el-form-item prop="isHomeDelivery">
            <el-checkbox v-model="entity.isHomeDelivery" true-label="1" false-label="0">到家配送点</el-checkbox>
            <div>该门店支持门店配送到家业务</div>
          </el-form-item>
          <el-form-item prop="isStoreExtraction">
            <el-checkbox v-model="entity.isStoreExtraction" true-label="1" false-label="0">门店自提点</el-checkbox>
            <div>支持买家网上下单后自行到门店提货</div>
          </el-form-item>
          <el-form-item v-if="getEnterpriseConfig().groupBuyAuthority == 1" prop="isCommunityGroupExtraction">
            <el-checkbox v-model="entity.isCommunityGroupExtraction" true-label="1" false-label="0">社区团购提货点
            </el-checkbox>
            <div>该门店支持社区团购业务</div>
          </el-form-item>
        </el-form-item>
        <el-form-item label="绑定仓库：" prop="warehouseID">
          <el-button ref='btnWarehouse' type="text" @click="selectWarehouse()">{{entity.warehouseName}} </el-button>
        </el-form-item>
        <el-form-item label="第三方门店ID：" prop="thirdStoreId" placeholder="请输入第三方门店ID">
          <el-input v-model="entity.thirdStoreId" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="newStoreDialog = false">取 消</el-button>
        <el-button type="primary" @click="saveEntity(1)">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 门店账号信息弹窗 -->
    <el-dialog class="new-store-dialog" title="编辑门店账号" :visible.sync="newStoreAccountDialog" width="50%">
      <el-form :model="entity" :rules="rules" ref="entity" label-width="140px">

        <el-form-item label="主管理员姓名：" prop="administratorsName" placeholder="请输入主管理员姓名">
          <el-input v-model="entity.administratorsName" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="登录手机号：" prop="administratorsPhone">
          <!-- <el-input v-model="entity.administratorsPhone" autocomplete="off"></el-input> -->
          <el-input v-model="entity.administratorsPhone" type="tel" placeholder="请输入登录手机号" maxlength="11"
            oninput="this.value=this.value.replace(/^[0,2,3,4,5,6,7,8,9]*$/gi,'')"
            onkeyup="this.value=this.value.replace(/\D/g,'')"></el-input>
        </el-form-item>
        <el-form-item label="登录密码：" prop="password">
          <el-input v-model="entity.password" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="确认密码：" prop="storeLoginRePassword">
          <el-input v-model="storeLoginRePassword" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="所属角色" prop="subRoleId">
          <div>
            <el-select v-model="entity.subRoleId" placeholder="请选择">
              <el-option v-for="(item, index) in subRoleList" :key="item.subRoleId" :label="item.name"
                :value="item.subRoleId" />
            </el-select>
          </div>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="newStoreAccountDialog = false">取 消</el-button>
        <el-button type="primary" @click="saveEntity(2)">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 仓库选择器弹窗 -->
    <el-dialog title="仓库选择器" :visible.sync="warehouseDialog" width="30%" @close="warehouseClose">
      <div class="pad-l-20 pad-r-20">
        <el-input style="width:200px;" v-model="searchListQuery.warehouseName" placeholder="请输入仓库名称">
        </el-input>
        <el-button-group class="mar-l-15">
          <el-button type="primary" @click="warehouseSearch">查询</el-button>
          <el-button @click="warehouseReset">重置</el-button>
        </el-button-group>
      </div>
      <el-table class="mar-t-20" :data="tableData" header-cell-class-name="default-header" row-class-name="default-row"
        style="width: 100%">
        <el-table-column prop="warehouseName" label="仓库名称">
        </el-table-column>
        <el-table-column prop="name" label="操作">
          <template slot-scope="scope">
            <el-button @click="selectCurrentWarehouse(scope.row)">选择</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>
<script>
  import {
    pagingMemberStore,
    deleteStoreInfo,
    pagingAllAddressList,
    getEnterpriseStoreApplyCode,
    updataStoreState,
    editStoreInfo,
    editStoreAccountInfo
  } from '@/api/user/memberStore'
  import {
    listArea
  } from '@/api/area/area'
  import {
    listEnterpeiseRole
  } from '@/api/system/role'
  import {
    pagingWarehouseSellList
  } from '@/api/warehouse/warehouseInfo'
  import {
    getBindSubUser
  } from '@/api/user/member'
  import {
    listBrandCategory
  } from '@/api/user/enterpriseBrand'
  import {
    getToken
  } from '@/utils/auth'
  import MapDeliveryRange from '@/components/MapDeliveryRange/index'
  import AddressSelect from '@/components/AddressSelect/index'
  export default {
    components: {
      MapDeliveryRange,
      AddressSelect
    },
    data() {
      // 自定义地址验证规则
      var addressRule = (rule, value, callback) => {
        if (!this.entity.provinceCode || !this.entity.cityCode || !this.entity.districtCode) {
          return callback(new Error('门店省市区地址不能为空！'))
        } else {
          callback()
        }
      }
      return {
        storeOptions: [{
          value: 'storeName',
          label: '门店名称'
        }, {
          value: 'storePhone',
          label: '门店电话'
        }, {
          value: 'storeAddress',
          label: '门店地址'
        }, {
          value: 'warehouseName',
          label: '仓库名称'
        }, {
          value: 'administratorsName',
          label: '管理员姓名、账号'
        }],
        rules: {
          storeName: [{
            required: true,
            message: '请填写门店名称',
            trigger: 'blur'
          }],
          storePhone: [{
            required: true,
            message: '请填写门店电话',
            pattern: /^(4|8)[0-9]{2,3}-[0-9]{3,4}-[0-9]{3,4}$|1(3|4|5|6|7|8|9)([0-9]{9})$|0[0-9]{2,3}-[0-9]{7,8}$/,
            trigger: 'blur'
          }],
          storeImage: [{
            required: true,
            message: '请上传门店照片',
            trigger: 'blur'
          }],
          province: [{
            required: true,
            message: '请选择门店所在省份',
            trigger: 'change'
          }],
          city: [{
            required: true,
            message: '请选择门店所在城市',
            trigger: 'change'
          }],
          area: [{
            required: true,
            message: '请选择门店所在县区',
            trigger: 'change'
          }],
          selectPCDValue: [{
            required: true,
            validator: addressRule,
            trigger: 'change'
          }],
          storeAddress: [{
            required: true,
            message: '详细地址不能为空',
            trigger: 'blur'
          }],
          warehouseID: [{
            required: true,
            message: '请选择绑定仓库',
            trigger: 'blur'
          }],
          administratorsName: [{
            required: true,
            message: '请填写主管理员姓名',
            trigger: 'blur'
          }],
          administratorsPhone: [{
            required: true,
            message: '请填写主管理员登录账号',
            trigger: 'blur'
          }],
          subRoleId: [{
            required: true,
            message: '请选择角色',
            trigger: 'change'
          }],
          thirdStoreId: [{
            required: true,
            pattern: /^[0-9]\d*$/,
            message: '请填写第三方门店ID且只能输入纯数字',
            trigger: 'blur'
          }]
        },
        entityList: [],
        total: 0,
        keyworkedName: '',
        listCategory: [],
        listLoading: false,
        shareFileLoading: false,
        provinceList: [],
        cityList: [],
        districtList: [],
        userCityList: [],
        userDistrictList: [],
        tableData: [],
        storeAddress: '',
        subRoleList: [],
        entity: {
          enterpriseId: this.getEnterpriseId(),
          memberId: '',
          memberAvatar: '',
          memberNickName: '',
          memberPhone: '',
          storeId: '',
          storeName: '',
          storePhone: '',
          provinceCode: '',
          cityCode: '',
          districtCode: '',
          provinceName: '',
          cityName: '',
          districtName: '',
          storeImage: '',
          subUserId: '',
          administratorsName: '',
          administratorsPhone: '',
          password: '',
          thirdStoreId: '',
          subRoleId: '',
          isCustomAddress: '',
          storeAddress: '',
          isHomeDelivery: '0',
          isStoreExtraction: '0',
          isCommunityGroupExtraction: '0',
          warehouseID: '',
          warehouseName: '',
          storeState: '1',
          currentPage: 1,
          size: 10,
          keywordType: 'storeName',
          keyword: ''
        },
        searchListQuery: {
          currentPage: 1,
          size: 10,
          enterpriseId: '',
          supplierId: '',
          warehouseSource: '',
          warehouseType: '',
          warehouseName: ''
        },
        entityVisible: false,
        newStoreDialog: false,
        newStoreAccountDialog: false,
        warehouseDialog: false,
        address: '',
        deliveryRangeList: [],
        codeVisible: false,
        commanderWxaCode: '',
        storeLoginRePassword: ''
      }
    },

    created() {
      this.token = {
        accessToken: getToken()
      }
      this.getList()
      this.listBrandCategory()
      this.initAreaList()
      this.listEnterpeiseRole()
      this.getEnterpriseStoreApplyCode()
    },

    methods: {
      showStoreBusinessFormat(row, colomn) {
        var actions = []
        if (row.isHomeDelivery === 1) {
          actions.push('到家配送点')
        }
        if (row.isStoreExtraction === 1) {
          if (actions.length > 0) {
            actions.push(' | ')
          }
          actions.push('门店自提点')
        }
        if (row.isCommunityGroupExtraction === 1) {
          if (actions.length > 0) {
            actions.push(' | ')
          }
          actions.push('社区团购提货点')
        }
        return actions.join('')
      },
      storeAddressFormat(row, colomn) {
        var actions = []
        if (row.provinceName) {
          actions.push(row.provinceName)
        }
        if (row.cityName) {
          actions.push(row.cityName)
        }
        if (row.districtName) {
          actions.push(row.districtName)
        }
        actions.push(row.storeAddress)
        return actions.join('')
      },
      getList() {
        this.listLoading = true
        pagingMemberStore(this.entity).then(response => {
          if (response.isError) return
          this.entityList = response.data.records
          this.total = response.data.total
          this.listLoading = false
        })
      },
      handleSearch() {
        this.getList()
      },
      handleReset() {
        this.entity = {
          keyword: '',
          keywordType: 'storeName',
          currentPage: 1,
          size: 10,
          enterpriseId: this.getEnterpriseId()
        }
        this.keyworkedName = ''
        this.getList()
      },
      listBrandCategory() {
        listBrandCategory(this.getEnterpriseId()).then(response => {
          if (response.isError) return
          this.listCategory = response.data
        })
      },
      listEnterpeiseRole() {
        listEnterpeiseRole({
          enterpriseId: this.getEnterpriseId(),
          memberFlag: 1
        }).then(response => {
          if (response.isError) return
          this.subRoleList = response.data
        })
      },
      delBrand(row) {
        deleteStoreInfo(row.storeId).then((response) => {
          if (response.isError) return
          this.getList()
          this.$message({
            type: 'success',
            message: '删除成功!'
          })
        })
      },
      initAreaList() {
        listArea().then(response => {
          this.provinceList = response.data.provinceList
          this.cityList = response.data.cityList
          this.districtList = response.data.districtList
        })
      },
      // 获取开通门店权限申请码
      getEnterpriseStoreApplyCode() {
        getEnterpriseStoreApplyCode({
          enterpriseId: this.getEnterpriseId()
        }).then((response) => {
          this.commanderWxaCode = response.data
        })
      },
      // 启用禁用设置
      switchChange(row) {
        updataStoreState(row.memberId, row.storeState).then(response => {
          if (response.isError) return
          this.$message({
            type: 'success',
            message: response.msg
          })
        })
      },
      // 编辑门店信息
      editStoreInfo(row) {
        this.newStoreDialog = true
        if (row) {
          this.seteEtity(row)
          getBindSubUser(this.entity.memberId).then(response => {
            if (response.isError) return
            this.entity.subRoleId = response.data.subRoleId
          })
          pagingAllAddressList(row.storeId).then((response) => {
            if (response.isError) return
            this.entity.deliveryRangeList = response.data.deliveryRangeList
            this.deliveryRangeList = response.data.deliveryRangeList
            // 初始化是否自定义配送范围
            this.$refs.deliveryRangeRef.setData(this.entity.isCustomAddress)
          })
          var warehouseName = '选择仓库'
          if (row.warehouseName !== undefined) {
            warehouseName = row.warehouseName
          }
          this.entity.warehouseName = warehouseName
          // this.$refs.btnWarehouse.$el.innerText = warehouseName
        }
        this.$nextTick(() => {
          // 初始化省市区
          this.$refs.addressSelectRef.setData(row.provinceCode, row.cityCode, row.districtCode)
        })
      },
      // 编辑账户信息
      editMemberInfo(row) {
        this.newStoreAccountDialog = true
        this.entity.password = ''
        this.seteEtity(row)
        getBindSubUser(this.entity.memberId).then(response => {
          if (response.isError) return
          this.entity.subRoleId = response.data.subRoleId
          this.entity.subUserId = response.data.subUserId
        })
      },
      // 门店业务转换
      transformationStoreBusiness(row) {
        if (row.isHomeDelivery === 1) {
          this.entity.isHomeDelivery = true
        } else {
          this.entity.isHomeDelivery = false
        }
        if (row.isStoreExtraction === 1) {
          this.entity.isStoreExtraction = true
        } else {
          this.entity.isStoreExtraction = false
        }
        if (row.isCommunityGroupExtraction === 1) {
          this.entity.isCommunityGroupExtraction = true
        } else {
          this.entity.isCommunityGroupExtraction = false
        }
      },
      // 省市区改变监听的方法
      onChangeAddressCode(pCode, cCode, dCode, pName, cName, dName) {
        this.entity.provinceCode = pCode
        this.entity.cityCode = cCode
        this.entity.districtCode = dCode
        this.entity.provinceName = pName
        this.entity.cityName = cName
        this.entity.districtName = dName
        this.entity.storeAddress = ''
      },
      // 回调函数，确认已画好的配送范围，参数也会为空
      handleConfirm(deliveryRangeList) {
        this.entity.deliveryRangeList = deliveryRangeList
        this.deliveryRangeList = deliveryRangeList
        console.log('要保存的经纬度：' + this.entity.deliveryRangeList)
      },
      // 点击切换是否自定义配送范围
      onHandleIsCustomDeliveryRange(e) {
        this.$refs.deliveryRangeRef.initIsCustomDeliveryRange(this.getAddressDetail(), e)
        console.log('切换回调：' + e)
      },
      // 切换是否自定义配送范围 回调函数
      handleCustomDeliveryRange(isCustomDeliveryRange) {
        this.entity.isCustomAddress = isCustomDeliveryRange
        console.log('是否自定义范围：' + isCustomDeliveryRange)
      },
      // 点击设置
      onHandleSetCustomDeliveryRange() {
        this.$refs.deliveryRangeRef.initCustomDeliveryRange(this.$refs.addressSelectRef.getCityName(), this
          .getAddressDetail(), this.deliveryRangeList)
      },
      // 获取地址
      getAddressDetail() {
        var address = ''
        var pcdName = this.$refs.addressSelectRef.getPCDName()
        if (pcdName && this.entity.storeAddress) {
          address = pcdName + this.entity.storeAddress
        }
        return address
      },
      // 设置表单数据
      seteEtity(obj) {
        this.entity = {
          enterpriseId: obj.enterpriseId,
          storeId: obj.storeId,
          memberId: obj.memberId,
          memberAvatar: obj.memberAvatar,
          memberNickName: obj.memberNickName,
          memberPhone: obj.memberPhone,
          storeName: obj.storeName,
          storePhone: obj.storePhone,
          provinceCode: obj.provinceCode,
          cityCode: obj.cityCode,
          districtCode: obj.districtCode,
          provinceName: obj.provinceName,
          cityName: obj.cityName,
          districtName: obj.districtName,
          storeImage: obj.storeImage,
          subUserId: obj.subUserId,
          administratorsName: obj.administratorsName,
          administratorsPhone: obj.administratorsPhone,
          password: '',
          thirdStoreId: obj.thirdStoreId,
          subRoleId: obj.subRoleId,
          isCustomAddress: obj.isCustomAddress,
          storeAddress: obj.storeAddress,
          isHomeDelivery: obj.isHomeDelivery + '',
          isStoreExtraction: obj.isStoreExtraction + '',
          isCommunityGroupExtraction: obj.isCommunityGroupExtraction + '',
          warehouseID: obj.warehouseID,
          warehouseName: obj.warehouseName,
          storeState: obj.storeState,

          currentPage: 1,
          size: 10,
          keywordType: 'storeName',
          keyword: ''

        }
      },
      // 保存
      saveEntity(type) {
        if (type === 1) {
          this.saveStoreInfo()
        } else {
          if (this.entity.password === null && this.storeLoginRePassword === null) {
            this.editStoreAccountInfo()
          } else if (this.entity.password === this.storeLoginRePassword) {
            this.editStoreAccountInfo()
          } else {
            this.passwordCheck()
          }
        }
      },
      // 保存编辑门店信息
      saveStoreInfo() {
        var that = this
        that.$refs['entity'].validate((valid) => {
          if (valid) {
            that.entity.enterpriseId = that.getEnterpriseId()
            // var isHomeDelivery = that.entity.isHomeDelivery === true ? 1 : 0
            // var isStoreExtraction = that.entity.isStoreExtraction === true ? 1 : 0
            // var isCommunityGroupExtraction = that.entity.isCommunityGroupExtraction === true ? 1 : 0
            if (that.entity.isHomeDelivery === '0' && that.entity.isStoreExtraction === '0' && that.entity
              .isCommunityGroupExtraction === '0') {
              that.msgError('门店业务至少选择一项')
              return false
            }
            // that.entity.isHomeDelivery = isHomeDelivery
            // that.entity.isStoreExtraction = isStoreExtraction
            // that.entity.isCommunityGroupExtraction = isCommunityGroupExtraction
            editStoreInfo(that.entity).then(response => {
              if (response.isError) return
              that.$message({
                message: '保存成功',
                type: 'success'
              })
              that.handleReset()
              that.newStoreDialog = false
              that.newStoreAccountDialog = false
            })
          }
        })
      },
      // 保存编辑门店账号信息
      editStoreAccountInfo() {
        this.$refs['entity'].validate((valid) => {
          if (valid) {
            this.entity.enterpriseId = this.getEnterpriseId()
            editStoreAccountInfo(this.entity).then(response => {
              if (response.isError) return
              this.$message({
                message: '保存成功',
                type: 'success'
              })
              this.handleReset()
              this.newStoreDialog = false
              this.newStoreAccountDialog = false
            })
          }
        })
      },
      // 登录密码和确认密码校验
      passwordCheck() {
        this.$message.error('登录密码和确认密码不一致！')
      },
      // 更改当前页数
      handleCurrentChange(val) {
        this.entity.currentPage = val
        this.getList()
      },
      // 更改当前页面大小
      handleSizeChange(val) {
        this.entity.size = val
        this.getList()
      },
      // 勾选
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
      closeEls() {
        this.entity.storeImage = ''
      },
      beforeShareImageUrlUpload(file) {
        const isJPG = file.type === 'image/jpeg'
        const isGIF = file.type === 'image/gif'
        const isPNG = file.type === 'image/png'
        const isBMP = file.type === 'image/bmp'

        if (!isJPG && !isGIF && !isPNG && !isBMP) {
          this.$message.error('上传图片必须是JPG/GIF/PNG/BMP 格式!')
        }
        this.shareFileLoading = true
        return (isJPG || isBMP || isGIF || isPNG)
      },
      handleUploadShareImageUrlSuccess(res, file) {
        this.shareFileLoading = false
        if (res.code === 101) {
          const imageUrl = res.data[0]
          this.entity.storeImage = imageUrl
        } else {
          this.$message({
            type: 'error',
            message: res.msg
          })
          return false
        }
      },

      selectWarehouse() {
        this.warehouseDialog = true
        this.searchListQuery.enterpriseId = this.getEnterpriseId()
        this.searchListQuery.supplierId = this.getSupplierId()
        this.searchListQuery.warehouseSource = this.getSupplierId() ? 2 : 1
        pagingWarehouseSellList(this.searchListQuery).then(response => {
          this.tableData = response.data
        })
      },
      // 选择当前所选的仓库
      selectCurrentWarehouse(row) {
        this.entity.warehouseName = row.warehouseName
        this.entity.warehouseID = row.warehouseId
        this.warehouseDialog = false
        // this.$refs.btn1是取上面id为btn1的元素（说id是不严谨的）
        // this.$refs.btnWarehouse.$el.innerText = this.entity.warehouseName
      },
      warehouseClose() {
        this.warehouseDialog = false
      },
      // 仓库搜索
      warehouseSearch() {
        this.selectWarehouse()
      },
      // 仓库搜索重置
      warehouseReset() {
        this.searchListQuery = {
          currentPage: 1,
          size: 10,
          enterpriseId: '',
          supplierId: '',
          warehouseSource: '',
          warehouseType: '',
          warehouseName: ''
        }
        this.selectWarehouse()
      },
      linkStoreGoodsPage(row) {
        this.$router.push({
          path: '/card/goods/enterprise-store-goods/index',
          query: {
            memberId: row.memberId
          }
        })
      }
    }

  }
</script>

<style lang="less" scoped>
  user-avatar {
    width: 68px;
    height: 68px;
    display: block;
    padding: 1px;
  }

  .v-align-h {
    justify-content: space-between;
    display: flex;
    flex-direction: column;
  }

  .new-store-dialog {
    /deep/.el-dialog__body {
      height: 500px;
      padding: 50px 50px 0;
      overflow: auto;

      .el-input {
        .el-input__inner {
          width: 60%;
        }
      }

      .el-select {
        .el-input__inner {
          width: 100%;
        }
      }

      .cascader {
        width: 140px;
        // .el-select{
        //   width: 140px;
        // }
      }
    }
  }

  .selectMap {
    display: flex;
    align-items: center;
    justify-content: center;

    /deep/.el-dialog {
      margin: 0 !important;
    }

    .s-result {
      height: 200px;
      overflow-y: scroll;
    }
  }

  .search-input {
    width: 96%;
    margin: 0 auto;
    display: block;

    /deep/ .el-input__inner {
      background-color: #f5f5f5;
    }
  }

  #toolControl {
    position: absolute;
    top: 135px;
    left: 50%;
    transform: translate(-50%);
    z-index: 1001;
  }

  .toolItem {
    width: 30px;
    height: 30px;
    float: left;
    margin: 1px;
    padding: 4px;
    border-radius: 3px;
    background-size: 30px 30px;
    background-repeat: no-repeat;
    box-shadow: 0 1px 2px 0 #E4E7EF;
    background-color: #ffffff;
    border: 1px solid #ffffff;
  }

  .toolItem:hover {
    border-color: #789CFF;
  }

  #delete {
    background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/delete.png');
  }

  .takeSelect {
    /deep/.el-input {
      width: 160px;
    }
  }

  .code-box {
    width: 90%;
    margin: 0 auto;
    text-align: center;
    border-radius: 10px;
    background: #ffffff;
    padding: 30px;

    img {
      width: 90%;
    }
  }
</style>
